<template>
  <div class="foot">
    <div class="top_div">
      <div class="max_width top_content">
        <ul class="ulfff">
          <p class="title">了解更多</p>
          <li v-for="(item, index) in foot_List" :key="index">
            {{ item.txt }}
          </li>
        </ul>
        <ul>
          <p class="title">联系我们</p>
          <div class="contact">
            <p><span>地址:</span>{{ foot_List2.address }}</p>
            <p><span>手机:</span> {{ foot_List2.phone }}</p>
          </div>
        </ul>
        <ul>
          <p class="title">微信公众号</p>
          <img alt="微信公众号" class="wx_img" src="../assets/foot/wx.png" />
        </ul>
      </div>
    </div>
    <!-- 版权 -->
    <p class="copyright">
      Shandong Bairui Software Technology Co., Ltd.
      山东柏瑞软件科技有限公司版权所有 鲁ICP备17006298号-1
    </p>
  </div>
</template>
<script>
export default {
  name: "Foot",
  data() {
    return {
      foot_List: [{ txt: "创新谷" }, { txt: "发展历程" }, { txt: "管理系统" }],
      foot_List2: {
        address: "济南创新谷2号楼孵化器五楼(长清区海棠路与芙蓉路交叉路口东南)",
        phone: "18661349342",
      },
    };
  },
};
</script>
<style lang="scss" scoped>
.ulfff {
  border-right: 1px solid #fff;
  padding-right: 115px;
}
.foot {
  height: 290px;
  margin-top: 50px;

  .top_div {
    height: 249px;
    background: #3e3e3e;
    padding: 50px 0;

    .top_content {
      margin: 0 auto;
      color: white;
      display: flex;
      justify-content: space-around;

      ul {
        li {
          font-size: 18px;
          line-height: 34px;
          cursor: pointer;
        }

        .title {
          color: white;
          font-size: 20px;
          line-height: 24px;
          padding-bottom: 40px;
        }

        .contact {
          display: flex;
          flex-direction: column;

          p {
            width: 298px;
            letter-spacing: 1.5px;
            cursor: pointer;
          }

          span {
            margin-right: 11px;
            line-height: 35px;
          }
        }
      }

      .wx_img {
        width: 103px;
        height: 103px;
      }
    }
  }

  // 版权
  .copyright {
    line-height: 41px;
    background: #f0f0f0;
    text-align: center;
  }
}
</style>
